var $player = document.getElementById('play');
var $pause = document.getElementById('pause');
var $playHref = document.getElementById('playUrl');
var $container = document.getElementById('container');
var $destroy = document.getElementById('destroy');

var showOperateBtns = false; // 是否显示按钮
var forceNoOffscreen = true; //
var jessibuca = null;

function create() {
	jessibuca = new Jessibuca({
		container: $container,
		videoBuffer: 0.2, // 缓存时长
		isResize: false,
		text: "",
		loadingText: "",
		useMSE: false,
		debug: true,
		showBandwidth: showOperateBtns, // 显示网速
		operateBtns: {
			fullscreen: showOperateBtns,
			screenshot: showOperateBtns,
			play: showOperateBtns,
			audio: false,
			recorder: false
		},
		forceNoOffscreen: forceNoOffscreen,
		isNotMute: false,
	}, );

	jessibuca.onLog = msg => console.error(msg);
	jessibuca.onRecord = (status) => console.log('onRecord', status);
	jessibuca.onPause = () => console.log('onPause');
	jessibuca.onPlay = () => console.log('onPlay');
	jessibuca.onFullscreen = msg => console.log('onFullscreen', msg);
	jessibuca.onMute = msg => console.log('onMute', msg);
	$player.style.display = 'inline-block';
	$pause.style.display = 'none';
	$destroy.style.display = 'none';
}


create();

$player.addEventListener('click', function() {
	var href = $playHref.value;
	if (href) {
		jessibuca.play(href);
		$player.style.display = 'none';
		$pause.style.display = 'inline-block';
		$destroy.style.display = 'inline-block';
	}
}, false)


$pause.addEventListener('click', function() {
	$player.style.display = 'inline-block';
	$pause.style.display = 'none';
	jessibuca.pause();
})

$destroy.addEventListener('click', function() {
	if (jessibuca) {
		jessibuca.destroy();
	}
	create();
})